﻿

<script src="~/echarts.common.min.js"></script>
<script src="~/ZheXian/highcharts.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js"></script>
@*<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=xfhhaTThl11qYVrqLZii6w8qE5ggnhrY&ecv=20190126"></script>*@
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.min.js"></script>

<script type="text/javascript">
    $(window).resize(function () {
        $("#divsss").attr("style", "height:100%;");
        $("#divss").attr("style", "height:100%;");
    });


    var tabRenLeiXing = 'yewuyuan';
    var tabShiJian = 'yue';
    var tuRenLeiXing = 'yewuyuan';
    var tuShiJian = 'yue';
    var tabTuanDuiLeiXing = 'xiaoshouzhanqu';
    var tabTuanDuiShiJian = 'yue';
    var zhexianLeixing = 'xiaoshouzhanqu';
    var zhexianShiJian = 'yue';
    $(document).ready(function () {
        $("#SpanTongJi").click();
        $("#divsss").attr("style", "height:100%;");
        $("#divss").attr("style", "height:100%;");
        //BindZhuTu();
        BindTabRenYuanBtn(1);
        BindZhuTubtn(1);
        BindTabTuanDuiBtn(1);
        BindZheXianBtn(1);

    });

    function BindTabRenYuan(shijian, leixing) {
        var lang = {
            "sProcessing": "大量处理中，请稍后...",
            "sLengthMenu": "每页 _MENU_ 项",
            "sZeroRecords": "没有匹配结果",
            "sInfo": "当前显示第 _START_ 至 _END_ 项，共 _TOTAL_ 项。",
            "sInfoEmpty": "当前显示第 0 至 0 项，共 0 项",
            "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
            "sInfoPostFix": "",
            "sSearch": "搜索:",
            "sUrl": "",
            "sEmptyTable": "表中数据为空",
            "sLoadingRecords": "载入中...",
            "sInfoThousands": ",",
            "oPaginate": {
                "sFirst": "首页",
                "sPrevious": "上页",
                "sNext": "下页",
                "sLast": "末页",
                "sJump": "跳转"
            },
            "oAria": {
                "sSortAscending": ": 以升序排列此列",
                "sSortDescending": ": 以降序排列此列"
            }
        };
        $("#dataTableRenYuan").dataTable().fnDestroy();
        $('#dataTableRenYuan').dataTable({
            "order": [[3, "desc"]],
            "language": lang,
            "processing": true,
            "serverSide": true,
            //"bStateSave": true,//状态保持模式
            "searching": false,//禁用搜索
            ajax: function (data, callback, settings) {
                //封装请求参数
                console.log(data);

                var param = {};
                param.limit = data.length;//页面显示记录条数，在页面显示每页显示多少项的时候
                param.start = data.start;//开始的记录序号
                param.page = (data.start / data.length) + 1;//当前页码
                param.dir = data.order[0].dir;
                param.column = data.order[0].column;
                param.leixing = leixing;
                param.shijian = shijian;
                //console.log(param);

                //ajax请求数据
                $.ajax({
                    type: "POST",
                    url: "../Home/ReturnXiaoShouETest",
                    cache: false,  //禁用缓存
                    data: param,  //传入组装的参数
                    dataType: "json",
                    success: function (result) {
                        //setTimeout仅为测试延迟效果
                        setTimeout(function () {
                            //封装返回数据
                            var returnData = {};
                            returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                            returnData.recordsTotal = result.total;//返回数据全部记录
                            returnData.recordsFiltered = result.total;//后台不实现过滤功能，每次查询均视作全部结果
                            returnData.data = result.data;//返回的数据列表
                            callback(returnData);
                        }, 200);
                    }
                });
            },
            "columns": [
                { "data": "XingMing" },
                { "data": "BeiZhu10" },
                { "data": "BeiZhu9" },
                { "data": "BeiZhu8" }
                //{ "data": "ChengJiaoShu", render: function (data, type, row) { return "<label>" + JiSuanZhuanHuanLv(row.DaiKanShu, row.ChengJiaoShu) + "</label>" } }
            ]
        });
        $("#divsss").attr("style", "height:100%;");
        $("#divss").attr("style", "height:100%;");
    }
    function BindTabRenYuanBtn(type) {
        switch (type) {
            case 1:
                tabShiJian = 'yue';
                break;
            case 2:
                tabShiJian = 'nian';
                break;
            case 3:
                tabRenLeiXing = 'yewuyuan';
                break;
            case 4:
                tabRenLeiXing = 'zhiyeguwen';
                break;
        }
        BindTabRenYuan(tabShiJian, tabRenLeiXing)
    }

    function BindZhuTu(shijian, leixing) {
        var namedate = [];
        var numdate = [];
        $.ajax({
            type: "POST",
            url: "../Home/ReturnXiaoShouETest",
            cache: false,  //禁用缓存
            async: false,
            data: { "start": 0, "limit": 10, "leixing": "" + leixing + "", "shijian": "" + shijian + "" },  //传入组装的参数
            dataType: "json",
            success: function (result) {
                for (var i = 0; i < result.data.length; i++) {
                    namedate.push("" + result.data[i].XingMing + "");
                    numdate.push("" + result.data[i].BeiZhu9 + "");
                }
            }
        });


        var dom = document.getElementById("ZhuXingTu");
        var myChart = echarts.init(dom);
        var app = {};
        option = null;
        app.title = '柱状图分数划分';
        //var namedate = ['小明', '小红', '小张', '小潘', '小陆', '小洪', '大张', '张三', '李四', '王五'];
        //var numdate = [60, 70, 80, 50, 70, 90, 110, 65, 75, 85];
        var colorlist = [];
        numdate.forEach(element => {
            if (element < 60) {
                colorlist.push(["#fc7095", "#fa8466"])
            } else if (element >= 60 && element < 90) {
                colorlist.push(["#386ffd", "#74b3ff"])
            } else {
                colorlist.push(["#1aa8ce", "#49d3c6"])
            }
        });
        option = {

            tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            grid: {
                left: '2%',
                right: '3%',
                bottom: '2%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                    data: namedate,
                    axisTick: {
                        alignWithLabel: true
                    },
                    axisLine: {
                        lineStyle: {
                            color: "#4dd1c4",
                            width: 1
                        }
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#999'
                        }
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    axisLabel: {
                        formatter: '{value} 万元',
                        show: true,
                        textStyle: {
                            color: '#999'
                        }
                    },
                    axisLine: {
                        lineStyle: {
                            color: "#4dd1c4",
                            width: 1
                        }
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            type: 'dashed',
                            color: '#ddd'
                        }
                    }

                }
            ],
            series: [
                {
                    name: '成交金额',
                    type: 'bar',
                    barWidth: '60%',
                    data: numdate,
                    itemStyle: {
                        normal: {
                            // color: new echarts.graphic.LinearGradient(
                            //     0, 0, 0, 1,
                            //     [
                            //         {offset: 1, color: 'red'},
                            //         {offset: 0, color: 'orange'}
                            //     ]
                            // )
                            color: function (params) {
                                // var colorList = colorlist;
                                // return colorList[params.dataIndex];
                                var colorList = colorlist

                                var index = params.dataIndex;
                                // if(params.dataIndex >= colorList.length){
                                //         index=params.dataIndex-colorList.length;
                                // }
                                return new echarts.graphic.LinearGradient(0, 0, 0, 1,
                                    [
                                        { offset: 1, color: colorList[index][0] },
                                        { offset: 0, color: colorList[index][1] }
                                    ]);


                            }
                        }
                    }
                }
            ]
        };

        if (option && typeof option === "object") {
            myChart.setOption(option, true);
        }
    }
    function BindZhuTubtn(type) {
        switch (type) {
            case 1:
                tuShiJian = 'yue';
                break;
            case 2:
                tuShiJian = 'nian';
                break;
            case 3:
                tuRenLeiXing = 'yewuyuan';
                break;
            case 4:
                tuRenLeiXing = 'zhiyeguwen';
                break;
        }
        BindZhuTu(tuShiJian, tuRenLeiXing)
    }

    function BindTabTuanDui(shijian, leixing) {
        //alert(shijian + "aaaaa" + leixing)

        var lang = {
            "sProcessing": "大量处理中，请稍后...",
            "sLengthMenu": "每页 _MENU_ 项",
            "sZeroRecords": "没有匹配结果",
            "sInfo": "当前显示第 _START_ 至 _END_ 项，共 _TOTAL_ 项。",
            "sInfoEmpty": "当前显示第 0 至 0 项，共 0 项",
            "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
            "sInfoPostFix": "",
            "sSearch": "搜索:",
            "sUrl": "",
            "sEmptyTable": "表中数据为空",
            "sLoadingRecords": "载入中...",
            "sInfoThousands": ",",
            "oPaginate": {
                "sFirst": "首页",
                "sPrevious": "上页",
                "sNext": "下页",
                "sLast": "末页",
                "sJump": "跳转"
            },
            "oAria": {
                "sSortAscending": ": 以升序排列此列",
                "sSortDescending": ": 以降序排列此列"
            }
        };
        $("#dataTableTuanDui").dataTable().fnDestroy();
        $('#dataTableTuanDui').dataTable({
            "order": [[4, "desc"]],
            "language": lang,
            "processing": true,
            "serverSide": true,
            //"bStateSave": true,//状态保持模式
            "searching": false,//禁用搜索
            ajax: function (data, callback, settings) {
                //封装请求参数
                //console.log(data);

                var param = {};
                param.limit = data.length;//页面显示记录条数，在页面显示每页显示多少项的时候
                param.start = data.start;//开始的记录序号
                param.page = (data.start / data.length) + 1;//当前页码
                param.dir = data.order[0].dir;
                param.column = data.order[0].column;
                param.leixing = leixing;
                param.shijian = shijian;
                //console.log(param);

                //ajax请求数据
                $.ajax({
                    type: "POST",
                    url: "../Home/ReturnTeamTest",
                    cache: false,  //禁用缓存
                    async: false,
                    data: param,  //传入组装的参数
                    dataType: "json",
                    success: function (result) {
                        console.log(result);
                        //setTimeout仅为测试延迟效果
                        setTimeout(function () {
                            //封装返回数据
                            var returnData = {};
                            returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                            returnData.recordsTotal = result.total;//返回数据全部记录
                            returnData.recordsFiltered = result.total;//后台不实现过滤功能，每次查询均视作全部结果
                            returnData.data = result.data;//返回的数据列表
                            callback(returnData);
                        }, 200);
                    }
                });
            },
            "columns": [
                { "data": "Name" },
                { "data": "PeopleName" },
                { "data": "DingDanShu" },
                { "data": "JinEBig" },
                { "data": "PaiMing" }
                //{ "data": "ChengJiaoShu", render: function (data, type, row) { return "<label>" + JiSuanZhuanHuanLv(row.DaiKanShu, row.ChengJiaoShu) + "</label>" } }
            ]
        });

        $("#divsss").attr("style", "height:100%;");
        $("#divss").attr("style", "height:100%;");

    }
    function BindTabTuanDuiBtn(type) {
        switch (type) {
            case 1:
                tabTuanDuiShiJian = 'yue';
                break;
            case 2:
                tabTuanDuiShiJian = 'nian';
                break;
            case 3:
                tabTuanDuiLeiXing = 'xiaoshouzhanqu';
                break;
            case 4:
                tabTuanDuiLeiXing = 'anchangtuandui';
                break;
        }
        BindTabTuanDui(tabTuanDuiShiJian, tabTuanDuiLeiXing);

    }

    function BindZheXian(shijian, leixing) {
        var TuanDui = [];
        var Tian = [];
        var Xian = [];

        $.ajax({
            type: "POST",
            url: "../Home/ReturnTeamNoTableTest",
            cache: false,  //禁用缓存
            async: false,
            data: { "leixing": "" + leixing + "", "shijian": "" + shijian + "" },  //传入组装的参数
            dataType: "json",
            success: function (result) {
                console.log(result);
                for (var i = 0; i < result[0].RetClass.length; i++) {
                    TuanDui.push('' + result[0].RetClass[i].Name + '')
                }

                for (var i = 0; i < result.length; i++) {
                    Tian.push('' + result[i].Day + '');
                }


                for (var i = 0; i < TuanDui.length; i++) {
                    var Dian = [];
                    for (var m = 0; m < Tian.length; m++) {
                        Dian.push(result[m].RetClass[i].JinE);
                    }

                    Xian.push({ name: '' + TuanDui[i] + '', type: 'line', data: Dian })
                }


                console.log(Tian);
                console.log(TuanDui);
                console.log(Xian);
            }
        });



        var dom = document.getElementById("container");
        var myChart = echarts.init(dom);
        var app = {};
        option = null;
        option = {
            title: {
                text: '',
                left: 'center'
            },
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b} : {c}'
            },
            legend: {
                left: 'left',
                data: TuanDui
            },
            xAxis: {
                type: 'category',
                name: 'x',
                splitLine: { show: false },
                data: Tian
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            yAxis: {
                type: 'log',
                name: 'y',
                minorTick: {
                    show: true
                },
                minorSplitLine: {
                    show: true
                }
            },
            series: Xian
        };
        ;
        if (option && typeof option === "object") {
            myChart.setOption(option, true);
        }
    }
    function BindZheXianBtn(type) {
        switch (type) {
            case 1:
                tuShiJian = 'yue';
                break;
            case 2:
                tuShiJian = 'nian';
                break;
            case 3:
                tuRenLeiXing = 'xiaoshouzhanqu';
                break;
            case 4:
                tuRenLeiXing = 'anchangtuandui';
                break;
        }
        BindZheXian(tuShiJian, tuRenLeiXing)
    }


    function BindGeZhongShuLiang() {
        $.ajax({
            type: "POST",
            url: "../PhoneGeRen/huiju",
            cache: false,  //禁用缓存
            data: {},  //传入组装的参数
            dataType: "json",
            success: function (result) {
                var json = result;
                if (json.length > 0) {
                    if (json[0].XingBie == "男") {
                        $("#div_nan").show();
                        $("#div_nv").hide();
                    } else {
                        $("#div_nan").hide();
                        $("#div_nv").show();
                    }
                }
            }
        });
    }

</script>



<div class="page-container" id="admui-pageContent">
    <div class="page animation-fade page-forms">
        <div class="page-content">
            <div class="panel">
                <div class="example-wrap">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="nav-tabs-horizontal" data-approve="nav-tabs">
                                <ul class="nav nav-tabs nav-tabs-line" role="tablist">
                                    <li class="nav-item">
                                        <a class="nav-link active" data-toggle="tab" href="#exampleTabsOne"
                                           aria-controls="exampleTabsOne" role="tab">
                                            本月
                                        </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" data-toggle="tab" href="#exampleTabsTwo" aria-controls="exampleTabsTwo"
                                           role="tab">
                                            本年
                                        </a>
                                    </li>
                                </ul>
                                <div class="tab-content pt-20">
                                    <div class="tab-pane active" id="exampleTabsOne" role="tabpanel">
                                        <div class="panel-body">
                                            <div class="row">
                                                <div class="col-lg-3">
                                                    <div class="card card-block p-25 bg-green-600">
                                                        <div class="counter counter-lg counter-inverse">
                                                            <div class="counter-label text-uppercase">新增客户</div>
                                                            <span class="counter-number"><label id="lbl_Yue_XinZengKeHuShu">@ViewData["xinzengkehushubymonth"]</label></span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-lg-3">
                                                    <div class="card card-block p-25 bg-orange-600">
                                                        <div class="counter counter-lg counter-inverse">
                                                            <div class="counter-label text-uppercase">带看客户</div>
                                                            <span class="counter-number"><label id="lbl_Yue_DaiKanKeHuShu">@ViewData["daikanshubymonth"]</label></span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-lg-3">
                                                    <div class="card card-block p-25 bg-purple-600">
                                                        <div class="counter counter-lg counter-inverse">
                                                            <div class="counter-label text-uppercase">成交客户</div>
                                                            <span class="counter-number"><label id="lbl_Yue_ChengJiaoDingDanShu">@ViewData["chengjiaoshubymonth"]</label></span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-lg-3">
                                                    <div class="card card-block p-25 bg-red-600">
                                                        <div class="counter counter-lg counter-inverse">
                                                            <div class="counter-label text-uppercase">订单总金额（万元）</div>
                                                            <span class="counter-number"><label id="lbl_Yue_DingDanZongJinE">@ViewData["retmoneystrbymonth"]</label></span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                    <div class="tab-pane" id="exampleTabsTwo" role="tabpanel">
                                        <div class="panel-body">
                                            <div class="row">
                                                <div class="col-lg-3">
                                                    <div class="card card-block p-25 bg-green-600">
                                                        <div class="counter counter-lg counter-inverse">
                                                            <div class="counter-label text-uppercase">新增客户</div>
                                                            <span class="counter-number"><label id="lbl_Nian_XinZengKeHuShu">@ViewData["xinzengkehushubyyear"]</label></span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-lg-3">
                                                    <div class="card card-block p-25 bg-orange-600">
                                                        <div class="counter counter-lg counter-inverse">
                                                            <div class="counter-label text-uppercase">带看客户</div>
                                                            <span class="counter-number"><label id="lbl_Nian_DaiKanKeHuShu">@ViewData["daikanshubyyear"]</label></span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-lg-3">
                                                    <div class="card card-block p-25 bg-purple-600">
                                                        <div class="counter counter-lg counter-inverse">
                                                            <div class="counter-label text-uppercase">成交客户</div>
                                                            <span class="counter-number"><label id="lbl_Nian_ChengJiaoDingDanShu">@ViewData["chengjiaoshubyyear"]</label></span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-lg-3">
                                                    <div class="card card-block p-25 bg-red-600">
                                                        <div class="counter counter-lg counter-inverse">
                                                            <div class="counter-label text-uppercase">订单总金额</div>
                                                            <span class="counter-number"><label id="lbl_Nian_DingDanZongJinE">@ViewData["retmoneystrbyyear"]</label></span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="nav-tabs-horizontal" data-approve="nav-tabs">
                                <ul class="nav nav-tabs nav-tabs-line" role="tablist" style="margin-left:60px;">
                                    <li class="nav-item">
                                        <a class="nav-link active" data-toggle="tab" href="#exampleTabsRenYuan" onclick="BindTabRenYuanBtn(1)" ;
                                           aria-controls="exampleTabsOne" role="tab">
                                            本月
                                        </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" data-toggle="tab" href="#exampleTabsRenYuan" aria-controls="exampleTabsTwo" onclick="BindTabRenYuanBtn(2)" ;
                                           role="tab">
                                            本年
                                        </a>
                                    </li>
                                </ul>
                                <div class="tab-content pt-20">
                                    <div class="tab-pane active" id="exampleTabsRenYuanYue" role="tabpanel">
                                        <div class="panel-body" style="padding-left:0px;">

                                            <div class="example-wrap">
                                                <div class="nav-tabs-vertical">
                                                    <ul class="nav nav-tabs nav-tabs-line mr-25" role="tablist">
                                                        <li class="nav-item">
                                                            <a class="nav-link active" data-toggle="tab" href="#exampleRenYuan" onclick="BindTabRenYuanBtn(3)" ;
                                                               aria-controls="exampleTabsLineLeftOne" role="tab">
                                                                业<br />务<br />员
                                                            </a>
                                                        </li>
                                                        <li class="nav-item">
                                                            <a class="nav-link" data-toggle="tab" href="#exampleRenYuan" onclick="BindTabRenYuanBtn(4)" ;
                                                               aria-controls="exampleTabsLineLeftTwo" role="tab">
                                                                置<br />业<br />顾<br />问
                                                            </a>
                                                        </li>

                                                    </ul>
                                                    <div class="tab-content py-15" id="divsss">
                                                        <div class="tab-pane active" id="exampleRenYuan" role="tabpanel">
                                                            <table class="table table-bordered table-hover dataTable table-striped w-full text-nowrap" id="dataTableRenYuan" data-plugin="dataTable">
                                                                <thead>
                                                                    <tr>
                                                                        <th>姓名</th>
                                                                        <th>订单数</th>
                                                                        <th>订单总金额</th>
                                                                        <th>排名</th>
                                                                    </tr>
                                                                </thead>
                                                                <tfoot>
                                                                    <tr>
                                                                        <th>姓名</th>
                                                                        <th>订单数</th>
                                                                        <th>订单总金额</th>
                                                                        <th>排名</th>
                                                                    </tr>
                                                                </tfoot>
                                                                <tbody>
                                                                </tbody>
                                                            </table>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="nav-tabs-horizontal" data-approve="nav-tabs">
                                <ul class="nav nav-tabs nav-tabs-line" role="tablist" style="margin-left:60px;">
                                    <li class="nav-item">
                                        <a class="nav-link active" data-toggle="tab" href="#exampleRenYuanZhuTu" onclick="BindZhuTubtn(1)"
                                           aria-controls="exampleTabsOne" role="tab">
                                            本月
                                        </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" data-toggle="tab" href="#exampleRenYuanZhuTu" aria-controls="exampleTabsTwo" onclick="BindZhuTubtn(2)"
                                           role="tab">
                                            本年
                                        </a>
                                    </li>
                                </ul>
                                <div class="tab-content pt-20" >
                                    <div class="tab-pane active" id="exampleRenYuanZhuTu" role="tabpanel">
                                        <div class="panel-body" style="padding-left:0px;">
                                            <div class="example-wrap">
                                                <div class="nav-tabs-vertical">
                                                    <ul class="nav nav-tabs nav-tabs-line mr-25" role="tablist">
                                                        <li class="nav-item">
                                                            <a class="nav-link active" data-toggle="tab" href="#exampleRenYuanZhuTu" onclick="BindZhuTubtn(3)"
                                                               aria-controls="exampleTabsLineLeftOne" role="tab">
                                                                业<br />务<br />员
                                                            </a>
                                                        </li>
                                                        <li class="nav-item">
                                                            <a class="nav-link" data-toggle="tab" href="#exampleRenYuanZhuTu" onclick="BindZhuTubtn(4)"
                                                               aria-controls="exampleTabsLineLeftTwo" role="tab">
                                                                置<br />业<br />顾<br />问
                                                            </a>
                                                        </li>
                                                    </ul>
                                                    <div class="tab-content py-15">
                                                        <div class="tab-pane active" id="exampleRenYuanZhuTu" role="tabpanel">
                                                            <div id="ZhuXingTu" style=" width: 700px;height: 500px;"></div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="nav-tabs-horizontal">
                                <ul class="nav nav-tabs nav-tabs-line" role="tablist" style="margin-left:60px;">
                                    <li class="nav-item">
                                        <a class="nav-link active" data-toggle="tab" href="#exampleTabsTuanDui" onclick="BindTabTuanDuiBtn(1)"
                                           aria-controls="exampleTabsOne" role="tab">
                                            本月
                                        </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" data-toggle="tab" href="#exampleTabsTuanDui" aria-controls="exampleTabsTwo" onclick="BindTabTuanDuiBtn(2)"
                                           role="tab">
                                            本年
                                        </a>
                                    </li>
                                </ul>
                                <div class="tab-content pt-20">
                                    <div class="tab-pane active" id="exampleTabsTuanDui">
                                        <div class="panel-body" style="padding-left:0px;">
                                            <div class="example-wrap">
                                                <div class="nav-tabs-vertical" id="div2">
                                                    <ul class="nav nav-tabs nav-tabs-line mr-25">
                                                        <li class="nav-item">
                                                            <a class="nav-link active" data-toggle="tab" href="#exampleTabsTuanDui" onclick="BindTabTuanDuiBtn(3)"
                                                               aria-controls="exampleTabsLineLeftOne">
                                                                销<br />售<br />战<br />区
                                                            </a>
                                                        </li>
                                                        <li class="nav-item">
                                                            <a class="nav-link" data-toggle="tab" href="#exampleTabsTuanDui" onclick="BindTabTuanDuiBtn(4)"
                                                               aria-controls="exampleTabsLineLeftTwo">
                                                                案<br />场<br />团<br />队
                                                            </a>
                                                        </li>
                                                    </ul>
                                                    <div class="tab-content" id="divss">
                                                        <div class="tab-pane active" id="exampleTabsTuanDui" role="tabpanel">
                                                            <table class="table table-bordered table-hover dataTable table-striped w-full text-nowrap" id="dataTableTuanDui" data-plugin="dataTable">
                                                                <thead>
                                                                    <tr>
                                                                        <th>团队名称</th>
                                                                        <th>负责人</th>
                                                                        <th>订单数</th>
                                                                        <th>订单总金额</th>
                                                                        <th>排名</th>
                                                                    </tr>
                                                                </thead>
                                                                <tfoot>
                                                                    <tr>
                                                                        <th>团队名称</th>
                                                                        <th>负责人</th>
                                                                        <th>订单数</th>
                                                                        <th>订单总金额</th>
                                                                        <th>排名</th>
                                                                    </tr>
                                                                </tfoot>
                                                                <tbody>
                                                                </tbody>
                                                            </table>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="nav-tabs-horizontal" data-approve="nav-tabs">
                                <ul class="nav nav-tabs nav-tabs-line" role="tablist" style="margin-left:60px;">
                                    <li class="nav-item">
                                        <a class="nav-link active" data-toggle="tab" href="#exampleTabsZheXian" onclick="BindZheXianBtn(1)"
                                           aria-controls="exampleTabsOne" role="tab">
                                            本月
                                        </a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" data-toggle="tab" href="#exampleTabsZheXian" aria-controls="exampleTabsTwo" onclick="BindZheXianBtn(2)"
                                           role="tab">
                                            本年
                                        </a>
                                    </li>
                                </ul>
                                <div class="tab-content pt-20">
                                    <div class="tab-pane active" id="exampleTabsZheXian" role="tabpanel">
                                        <div class="panel-body" style="padding-left:0px;">
                                            <div class="example-wrap">
                                                <div class="nav-tabs-vertical">
                                                    <ul class="nav nav-tabs nav-tabs-line mr-25" role="tablist">
                                                        <li class="nav-item">
                                                            <a class="nav-link active" data-toggle="tab" href="#exampleTabsZheXian" onclick="BindZheXianBtn(3)"
                                                               aria-controls="exampleTabsLineLeftOne" role="tab">
                                                                销<br />售<br />战<br />区
                                                            </a>
                                                        </li>
                                                        <li class="nav-item">
                                                            <a class="nav-link" data-toggle="tab" href="#exampleTabsZheXian" onclick="BindZheXianBtn(4)"
                                                               aria-controls="exampleTabsLineLeftTwo" role="tab">
                                                                案<br />场<br />团<br />队
                                                            </a>
                                                        </li>
                                                    </ul>
                                                    <div class="tab-content py-15">
                                                        <div class="tab-pane active" id="exampleTabsZheXian" role="tabpanel">
                                                            <div id="container" style=" width: 700px;height: 500px;"></div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>